
<link rel="stylesheet" href="__ADMIN__/ace/css/ui.jqgrid.css" />
<div class="modal fade" tabindex="-1" role="dialog" id="clientModal">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span
            aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">选择客户信息</h4>
      </div>
      <div class="modal-body">
        <table id="tbClient" class="table"></table>
        <div id="tbClientPager"></div>
      </div>
    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->
<script>
  var $jqGrid=$('#tbClient'),$pager=$('#tbClientPager');
  $jqGrid.jqGrid({
    url:"{:url('getClients')}",
    datatype:'json',
    mttype:'post',
    colNames:['操作','姓名','地址','电话'],
    colModel:[
      {name:'id',index:'id',width:'100',align:'center',formatter:function(value,options,obj){
//        console.log(obj);
        return '<a clientid="'+obj.id+'" name="'+obj.name+'" address="'+obj.address+'" phone="'+obj.phone+'" onclick="chooseClient.chooseConfirm(this)">选择</a>';
      }},
      {name:'name',index:'name',width:'100',align:'center'},
      {name:'address',index:'address',width:'100',align:'center'},
      {name:'phone',index:'phone',width:'100',align:'center'},
    ],
    height:'auto',
    pager: '#tbClientPager',
    viewrecords:true,
    rowNum:10,
    rowList:[10,20,40],
    autowidth:true
  });

  $('#btnSearch').click(function(){
    var q=$('#txtQuery').val();
    $jqGrid.jqGrid('setGridParam',{
      postData:{q:q},
      page:1
    }).trigger("reloadGrid");
  });

  chooseClient={
    chooseConfirm:function(obj){
      var id=$(obj).attr('clientid');
      var name=$(obj).attr('name');
      var address=$(obj).attr('address');
      var phone=$(obj).attr('phone');
      var html='<li>姓名：'+name+'</li>';
      html+='<li>地址：'+address+'</li>';
      html+='<li>电话：'+phone+'</li>';
      invoiceModal.clientId=id;
//        console.log(html);
      $('.info-cus-hook').html(html);
      $('#clientModal').modal('hide');

    }
  }
</script>


